// ChartWatcherMixin.js
import { nanoid } from 'nanoid'

export default {
  data() {
    return {
      chatClassName: `chat-${nanoid()}`,
      myChart: null
    }
  },
  watch: {
    allValues: {
      handler() {
        this.updateChart()
      },
      deep: true,
      immediate: true
    }
  },
  mounted() {
    // 基于准备好的dom，初始化echarts实例
    const myChart = this.$echarts.init(document.querySelector(`.${this.chatClassName}`))
    this.myChart = myChart

    this.updateChart()

    window.addEventListener('resize', this.resizeEcharts)
  },
  methods: {
    resizeEcharts() {
      this.myChart.resize()
    }
  }
}
